<template>
  <div class="container">
    <top-nav :toLastPath='true'>返回</top-nav>
    <ul>
      <li>
        <span>公司名称</span>
        <input type="text" name="name" placeholder="请输入公司名字" v-model="name">
      </li>
      <li>
        <span>手机号码</span>
        <input type="text" name="name" placeholder="请输入联系方式" v-model="tel">
      </li>
      <li>
        <span>法人姓名</span>
        <input type="tel" name="name" placeholder="请输入法人姓名" v-model="ledgl">
      </li>
      <li>
        <span>营业执照注册号</span>
        <input type="tel" name="name" placeholder="请输入营业执照注册号" v-model="number">
      </li>
      <li>
        <router-link :to="{'path':'/me/authentication/imageUpload','query':{'type':'enterprise'}}">
          <span>营业执照照片</span>
          <span>上传照片</span>
          <span>></span>
        </router-link>
      </li>
    </ul>
    <div class="commit" @click="commit">
      <div :class="{blue:blue}">保存</div>
    </div>
  </div>
</template>

<script>
import topNav from '@/components/topNav'
export default {
  data () {
    return {
      name:"",
      tel:"",
      ledgl:"",
      number:""
    }
  },
  components:{
    topNav
  },
  computed: {
    enterpriseFront:{
      get: function () {      
        return this.$store.state.modulesMe.enterpriseFront
      },
      set: function (newValue) {
        this.$store.dispatch('setEnterpriseFront',newValue)
      }
    },
    imageUpload:{
      get: function () {
        return this.$store.state.modulesMe.imageUpload
      },
      set: function (newValue) {
        this.$store.dispatch('setImageUpload',newValue)
      }
    },
    blue(){
      if(this.name&&this.tel&&this.ledgl&&this.number&&this.enterpriseFront.id!=0){
        return true
      }else{
        return false
      }
    }
  },

  methods: {
    async commit(){
      var userToken=window.localStorage.getItem('userToken')
      let res=await this.$axios.post('/ucenter/setCompanyAuthInfo',{user_token:userToken,name:this.name,contact_phone:this.tel,legal_person_name:this.ledgl,license:this.number,license_img_id:this.imageUpload[0]})
      if(res.data.level=="success"){
        this.$currency.showToast('你的认证已经提交',3000,'success')
        setTimeout(()=>{
          this.$router.push(`/me/authentication`)
      },3500)
      }else{
        this.$currency.showToast(res.data.message,3000,'fail')
      }
      
    },
    async getInformaiton(){
      if(this.imageUpload==""){
        var userToken=window.localStorage.getItem('userToken')
        let res=await this.$axios('/ucenter/getCompanyInfo',{params:{user_token:userToken}})
        this.name=res.data.data.name
        this.tel=res.data.data.contacts
        this.ledgl=res.data.data.legal_person_name
        this.number=res.data.data.license
        this.enterpriseFront.src=res.data.data.license_img_url
        this.enterpriseFront.id=res.data.data.license_img_id
        this.imageUpload[0]=res.data.data.license_img_id
      }
    }
  },
  activated(){
    this.getInformaiton()
  }
}
</script>

<style scoped>
.container{background-color: #F8F8FB;}
.container ul{width: 100%; margin-top:45px;}
.container ul li{width: 100%;height: 20px;display: flex;justify-content: row;padding: 20px 0px;background-color: #fff;margin-bottom: 2px;}
.container ul li span{width: 100px;font-size: 17px;color: #000000;padding-left: 25px;}
.container ul li input{width: 265px;border: 0px;font-size: 15px;color: #B2B2B9;}
.container ul li:nth-of-type(4) span{width: 135px;}
.container ul li:nth-of-type(4) input{width: 230px;}
.container ul li:nth-of-type(5) span{width: 120px;}
.container ul li:nth-of-type(5) span:nth-of-type(2),.container ul li span:nth-of-type(3){font-size:17px;color: #B2B2B9;line-height: 20px;}
.container ul li:nth-of-type(5) span:nth-of-type(2){width:60px;margin-left: 125px;font-size:12px;}
.container ul li:nth-of-type(5) span:nth-of-type(3){padding-left: 0px;width: 5px;}
.commit{position: fixed;bottom: 0px; left: 0px;width: 100%;height: 73px;background-color: #F8F8FB;}
.commit div{width: 345px;height: 48px;text-align: center;line-height: 48px;background-image: linear-gradient(-135deg, #D5D5DF 0%, #9292A2 100%);border-radius: 8px;margin: 12.5px auto;}
.commit div.blue{background-image:linear-gradient(-135deg, #57D1E2 0%, #37AED6 100%);}
</style>
